const util = require('../../utils/util.js')
//获取应用实例
const app = getApp()
Page({
  data: {
    src:'',
    width: 190,//宽度
    height: 145,//高度
    max_width: 190,
    max_height: 145,
    disable_ratio: true,//锁定比例
  },
  onLoad(options) {
    this.cropper = this.selectComponent("#image-cropper");
    if (options.imgx == 1 || options.imgx==3){
      this.setData({
        imgx: options.imgx     
      })
    }else if (options.imgx == 2) {
      this.setData({
        imgx: 2,
        width: 190,//宽度
        height: 190,//高度
        max_width: 190,
        max_height: 190
      })
    }
    this.cropper.imgReset(); 
    this.cropper.upload();//上传图片
  },
  cropperload(e) {

  },
  loadimage(e){
    wx.hideLoading();
    this.cropper.imgReset();
  },
  clickcut(e) {
    //图片预览
    wx.previewImage({
      current: e.detail.url, // 当前显示图片的http链接
      urls: [e.detail.url] // 需要预览的图片http链接列表
    })
  },
  upload(){
    let that = this;
    wx.chooseImage({
      count: 1,
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success(res) {
        wx.showLoading({
          title: '加载中',
        })
        const tempFilePaths = res.tempFilePaths[0];
        //重置图片角度、缩放、位置
        that.cropper.imgReset();
        that.setData({
          src: tempFilePaths
        });
      }
    })
  },
  setWidth(e){
    this.setData({
      width: e.detail.value < 10 ? 10 : e.detail.value,
      cut_left: this.cropper.data.cut_left
    });
  },
  setHeight(e){
    this.setData({
      height: e.detail.value < 10 ? 10 : e.detail.value,
      cut_top: this.cropper.data.cut_top
    });
  },
  switchChangeDisableRatio(e){
    //设置宽度之后使剪裁框居中
    this.setData({
      disable_ratio: e.detail.value
    });
  },
  setCutTop(e) {
    this.setData({
      cut_top: this.cropper.data.cut_top
    });
  },
  setCutLeft(e) {
    this.setData({
      cut_left: this.cropper.data.cut_left
    });
  },
  submit(){
    var that = this;
    this.cropper.getImg((obj)=>{
      if (that.data.imgx == 2) {
        app.globalData.imgSrc2 = obj.url;
      } else if (that.data.imgx == 1) {
        app.globalData.imgSrc = obj.url;
      } else if (that.data.imgx == 3) {
        app.globalData.imgSrc3 = obj.url;
      }
      wx.navigateBack({
        delta:1
      })
    });
  },
  rotate(){
    //在用户旋转的基础上旋转90°
    this.cropper.setAngle(this.cropper.data.angle+=90);
  },
  top(){
    this.data.top = setInterval(() => {
      this.cropper.setTransform({
        y: -3
      });
    }, 1000 / 60)
  },
  bottom(){
    this.data.bottom = setInterval(() => {
      this.cropper.setTransform({
        y: 3
      });
    }, 1000 / 60)
  },
  left(){
    this.data.left = setInterval(() => {
      this.cropper.setTransform({
        x: -3
      });
    }, 1000 / 60)
  },
  right(){
    this.data.right = setInterval(() => {
      this.cropper.setTransform({
        x: 3
      });
    }, 1000 / 60)
  },
  narrow() {
    this.data.narrow = setInterval(() => {
      this.cropper.setTransform({
        scale: -0.02
      });
    }, 1000 / 60)
  },
  enlarge() {
    this.data.enlarge = setInterval(() => {
      this.cropper.setTransform({
        scale: 0.02
      });
    }, 1000 / 60)
  },
  end(e) {
    clearInterval(this.data[e.currentTarget.dataset.type]);
  },
})
